<template>
<div>
  <!-- 
    这个文件是nuxt框架提供的默认布局组件，
    我们会把头部和底部内容封装在一个单独的组件中，这样
    的话布局组件内容看起就简洁（不会臃肿），也就更好维护了
   -->
  <Header></Header>
   <!-- nuxt标签，用于显示菜单页面内容的 -->
   <nuxt />
   <Footer></Footer>
</div>
</template>
<script>
// @ 表示根目录
import Header from '../components/header.vue'
import Footer from '@/components/footer.vue'
export default {
  components: { 
    // Header: Header,
    Header, // 像上面属性名和属性值名字一样的时候 可以简写
    Footer
  }
}
</script>
<style scoped>
</style>